<template>
    <div>
        <el-select v-model="selectedLanguage" style="width: 100px;" @change="changeLanguage">
            <el-option v-for="(lang, key) in supportedLanguages" :key="key" :label="lang" :value="key">
            </el-option>
        </el-select>
    </div>
</template>

<script>
import Cookie from 'js-cookie';

export default {
    data() {
        return {
            supportedLanguages: {
                en: "English",
                zh: "中文",
            },
            selectedLanguage: Cookie.get('language') || 'zh',
        };
    },
    methods: {
        changeLanguage() {
            Cookie.set('language', this.selectedLanguage)
            // 更新vue-i18n实例的当前语言
            this.$i18n.locale = this.selectedLanguage;
        },
    },
};
</script>
